<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>正则表达式</title>
</head>
<body>
    <script>
        // 类声明式写法
        // 

        /*
        <div class="custom-block tip">
      <p class="custom-block-title">TIP</p>
      <p>技术这个东西，一辈子只用学一次。之后的一生你都将享受技术为你带来的好处。</p>
      </div>
        */


        // 正则相关的方法
            
            // str.split()      根据规则给字符串分段
            // str.search()     根据规则查找下标
            // str.match()      根据规则筛选出符合条件的字符串
            // str.replace()    根据规则替换字符

            // //.test()        检查字符串是否符合正则表达式的要求

        // 正则相关的元素

            // .	查找单个字符，除了换行和行结束符。
            // \w	查找单词字符。
            // \W	查找非单词字符。
            // \d	查找数字。
            // \D	查找非数字字符。
            // \s	查找空白字符。
            // \S	查找非空白字符。
            // \b	匹配单词边界。
            // \B	匹配非单词边界。
            // \0	查找 NULL 字符。
            // \n	查找换行符。
            // \f	查找换页符。
            // \r	查找回车符。
            // \t	查找制表符。
            // \v	查找垂直制表符。
            // \xxx	查找以八进制数 xxx 规定的字符。
            // \xdd	查找以十六进制数 dd 规定的字符。

        // 正则相关的量词
        // {1,9}
        // ? 0个或者1个
        // + {1,} 至少要有1个
        // *

        // 正则相关的范围
        // ^ 字符串开始的位置:放在正则的开头
            // 如果 ^ 在规则中间, 那就是取反的意思
        // $ 字符串的结尾
        // g 全局匹配
        // i 忽略大小写
        // m 多行匹配

        // console.log(
        //     /^[a][z][w]-\d{4,}\n$/gi.test(`Azw-5598\n`)
        // )

        // 案例
        // 检查邮箱有效性

        // 英文+数字+下划线@英文+数字.英文
        // [a-zA-Z0-9_]+@[a-zA-Z0-9]+\.[a-zA-Z]+
        // let mail = '15021134415@163.com'
        // console.log(
        //     /^(\w|\d)+@[a-zA-Z0-9]+\.[a-zA-Z]+$/.test(mail)
        // )

        var str = `
            <h1>hello </h1>
        <div class="custom-block tip">
        <p class="custom-block-title">TIP</p>
        <p>技术这个东西，一辈子只用学一次。之后的一生你都将享受技术为你带来的好处。</p>
        </div><h1>hello </h1>
            `
        //     <div class="custom-block tip">
        // <p class="custom-block-title">TIP</p>
        // <p>技术这个东西，一辈子只用学一次。之后的一生你都将享受技术为你带来的好处。</p>
        // </div>

        str = str.match(/<div class="custom-block tip">(.|\n)*<\/div><h1/g)
        // div class="custom-block tip"
        console.log(
            str[0].replace(/<[^<>]+>(<h1)?/gm, '')
        )

    </script>
</body>
</html>